<template>
    <div class="nav-breadcrumb">
      <el-breadcrumb separator-class="el-icon-arrow-right" >
        <el-breadcrumb-item v-for="(item,index) in navdata" :key="index" @click.native='goto(item.url,index)' v-if="item.name!=null">{{item.name}}</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
</template>

<script>
    export default {
        name: "breadcrumb",
        props:{
          navdata: {
            type: Array,
            default: null
          },
        },
        methods:{
          goto(url,key){
            if(key<this.navdata.length-1){
              this.$router.push({
                path:url
              })
            }
          }
        }
    }
</script>

<style scoped lang="stylus" rel="stylesheet/stylus">
  @import "~style/base.styl"
  .nav-breadcrumb
    @extend .sWidth
    height  60px
</style>
